<template>
  <el-button
    :icon="icon"
    :type="type"
    :size="size"
    :title="title"
    @click="deleteHandle()">
    <template v-if="name != ''">{{ name }}</template>
  </el-button>
</template>
<script>
export default({
  props: {
    name: {
      type: String,
      default: function() { return '' }
    },
    icon: {
      type: String,
      // default: function() { return 'el-icon-delete' }
    },
    type: {
      type: String,
      default: function() { return 'text' }
    },
    plain: {
      type: Boolean,
      default: function() { return false }
    },
    size: {
      type: String,
      default: function() { return 'small' }
    },
    title: {
      type: String,
      default: function() { return '数据' }
    },
    api: {
      type: String
    },
    deleteData: {
      type: Number | String,
    }
  },

  data() {
    return {

    }
  },
  created() {

  },
  methods: {
    deleteHandle() {
      console.log(this.deleteData);
      if (Array.isArray(this.deleteData) && this.deleteData.length == 0) {
          this.$message.warning("请先选择！");
          return;
      }
      var type;
      if (String(this.deleteData).indexOf(",") == -1) {
          type = "个";
      } else {
          type = "些";
      }
      this.$confirm('确定要删除这' + type + this.title + '?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
        }).then(() => {
          this.$request('delete', this.api+'/'+this.deleteData.toString(), {}, (data, msg) => {
            this.$message.success(msg || '删除成功')
            this.$emit('confirm')
          }, msg => {
            this.$message.error(msg)
          })
        }).catch(() => {

        })       
    }
  }
})
</script>
<style lang="scss" scoped>
    .el-button--text{
        color:#F56C6C;
    }
</style>
